<%@ page contentType="text/html;charset=UTF-8"%>
<%@ page isELIgnored="false" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>TMP_ARTICLE</title>
<link rel="stylesheet" type="text/css" href="${ctx}/style/jw/css/jw.css" />
<script src="${ctx}/style/front/js/jquery-1.7.1.min.js" type="text/javascript"></script>
<script type="text/javascript" src="${ctx}/style/jw/js/jw.js"></script> 
</head>
<body>
<div style="margin:0 auto; width:800px;">
 <h3 style="font-size:28px; text-align:center; font-weight:bolder; margin-bottom:40px;">button按钮组</h3>

<table class="table table-bordered table-striped">
    <thead align="center">
      <tr>
        <th width="196" height="37">html标签为a/button</th>
        <th width="109">class名称</th>
        <th width="392">描述</th>
      </tr>
    </thead>
    <tbody align="center">
      <tr>
        <td height="58"><button class=" jw_btn" >Default</button></td>
        <td><code>jw_btn</code></td>
        <td>默认按钮样式,推荐用a标签</td>
      </tr>
      <tr>
        <td height="63"><a class="jw_btn orange jw_btn_mid " href="#">按钮1</a></td>
        <td><code>jw_btn orange jw_btn_mid </code></td>
        <td>中按钮</td>
      </tr>
      <tr>
        <td height="65"><a class="jw_btn red jw_btn_large" href="#">按钮2</a></td>
        <td><code>jw_btn red jw_btn_large</code></td>
        <td>大按钮</td>
      </tr>
      <tr>
        <td height="63"><a class="jw_btn blue jw_btn_small" href="#">按钮3</a></td>
        <td><code>jw_btn blue jw_btn_small</code></td>
        <td>小按钮</td>
      </tr>
      <tr>
        <td height="63"><a class="jw_btn rosy" href="#">按钮4</a></td>
        <td><code>jw_btn rosy</code></td>
        <td>&nbsp;</td>
      </tr>
      <tr>
        <td height="62"><a class="jw_btn green" href="#">按钮5</a></td>
        <td><code>jw_btn green</code></td>
        <td>&nbsp;</td>
      </tr>
      <tr>
        <td height="70"><a class="jw_btn pink" href="#">Inverse</a></td>
        <td><code>jw_btn pink</code></td>
        <td>&nbsp;</td>
      </tr>
      <tr>
        <td height="83"><a class="jw_btn yellow" href="#">Inverse</a></td>
        <td><code>jw_btn yellow</code></td>
        <td>&nbsp;</td>
      </tr>
      <tr>
        <td height="83"><a class="jw_btn black" href="#">Inverse</a></td>
        <td><code>jw_btn black</code></td>
        <td>&nbsp;</td>
      </tr>
    </tbody>
  </table>
 </div>
</body>
</html>